// TODO SOMEDAY: Feature Componetized like CrisisCenter

import 'rxjs/add/operator/switchMap';
import {Observable} from 'rxjs/Observable';
import {Component, OnInit} from '@angular/core';
import {Router, ActivatedRoute, ParamMap} from '@angular/router';
/*import { Http } from '@angular/http';*/
import {HttpClient, HttpInterceptor, HttpHandler, HttpRequest} from '@angular/common/http';

declare var $: any;

@Component({
  templateUrl: `./signature.component.html`,
  styleUrls: [`./signature.component.css`]
})
export class SignatureComponent implements OnInit {

  /*picPath="http://localhost:3000/wechat.png";*/
  postUrl = "http://localhost:3000/posts/pic";
  //postUrl = 'http://www.lunan:88/client/app/data/api/301'
  picPath = "";
  getpic = {"DH": "170807024", "XH": "2", "AttachXH": "1"};

  $sigdiv: any;

  constructor(private route: ActivatedRoute,
              private router: Router,
              private http: HttpClient) {
  }

  ngOnInit() {
    this.route.params
      .subscribe((params: ParamMap) => {
        this.getpic.DH = params['DH'];
        this.getpic.XH = params['XH'];
        this.getpic.AttachXH = params['AttachXH'];
      })

    this.$sigdiv = $("#signature").jSignature({'UndoButton': true, height: "300px"})
  }

  clearDrawData() {
    this.$sigdiv.jSignature('reset');
  }

  postDrawData() {
    var data = this.$sigdiv.jSignature('getData', 'svg')
    console.log(data);//data是一个数组data[0]为普片的类型,data[1]为图片数据

    let drawData = {
      "DH": this.getpic.DH,
      "XH": this.getpic.XH,
      "AttachXH": this.getpic.AttachXH,
      "Text_SVG": data[1],
      "X": 50,
      "Y": 50
    };
    this.http.post(this.postUrl, drawData).subscribe(returndata => {
      console.log(returndata);
      if (returndata['picPath'])
        this.picPath = returndata['picPath'];
    });
  }

}
